<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	<script src="../js/vue.min.js"></script>
	</head>
	<body> 
<!--在被控制的 #app 外面,使用 template 元素,定义组件的HTML模板结构 -->
  <div id="app">
      <mycom3></mycom3>
    </div>
  
  
    <div id="app2">
      <mycom3></mycom3>
      <login></login>
    </div>
  
  
    <!-- 在被控制的 #app 外面,使用 template 元素,定义组件的HTML模板结构  -->
    <template id="tmpl">
      <div>
        <select><option value="1">大学</option></select>
      </div>
    </template>
  
    <template id="tmpl2">
      旅游:<input type=checkbox value=1 name=ck1>
	  看书:<input type=checkbox value=2 name=ck1>
    </template>
  
    <script>
       Vue.component('mycom3', {
        template: '#tmpl'
      })
  
      // 创建 Vue 实例，得到 ViewModel
      var vm = new Vue({
        el: '#app',
        data: {},
        methods: {}
      });
  
  
      var vm2 = new Vue({
        el: '#app2',
        data: {},
        methods: {},
        components: { // 定义实例内部私有组件的
          login: {
            template: '#tmpl2'
          }
        },
      })
    </script>